/**
 * Created by Administrator on 2017/5/26.
 */
$(function() {
    //header
    //移入 我的E宠 时显示下拉菜单
    $(".active1").mouseover(function () {
        $(".mypet").css("display", "block");
        $(".active1 img").css({"transform": "rotate(270deg)", "transition": "all .1s"});
    });
    $(".active1").mouseout(function () {
        $(".mypet").css("display", "none");
        $(".active1 img").css({"transform": "rotate(90deg)", "transition": "all .1s"});
    });
    $(".mypet").mouseover(function () {
        $(".mypet").css("display", "block");
        $(".active1 img").css({"transform": "rotate(270deg)", "transition": "all .1s"});
    });
    $(".mypet").mouseout(function () {
        $(".mypet").css("display", "none");
        $(".active1 img").css({"transform": "rotate(90deg)", "transition": "all .1s"});
    });
    //移入 收藏我 时显示下拉菜单
    $(".active2").mouseover(function () {
        $(".collect").css("display", "block");
        $(".active2 img").css({"transform": "rotate(270deg)", "transition": "all .1s"});
    });
    $(".active2").mouseout(function () {
        $(".collect").css("display", "none");
        $(".active2 img").css({"transform": "rotate(90deg)", "transition": "all .1s"});
    });
    $(".collect").mouseover(function () {
        $(".collect").css("display", "block");
        $(".active2 img").css({"transform": "rotate(270deg)", "transition": "all .1s"});
    });
    $(".collect").mouseout(function () {
        $(".collect").css("display", "none");
        $(".active2 img").css({"transform": "rotate(90deg)", "transition": "all .1s"});
    });
    //移入 商品分类 时箭头转动
    $(".active4").mouseover(function () {
        $(".active4 img").css({"transform": "rotate(180deg) translateX(-5px)", "transition": "all .1s"});
        $(".list10,.part").css("display", "block");
        $(".cat").css("display", "none");
    });
    $(".list10,.part").mouseover(function () {
        $(".list10,.part").css("display", "block");
    })
    $(".list10,.part").mouseout(function () {
        $(".list10,.part").css("display", "none");
    })
    $(".active4").mouseout(function () {
        $(".list10,.part").css("display", "none");
        $(".active4 img").css({"transform": "rotate(0) translateX(0)", "transition": "all .1s"});
    });


    $(".active3").mouseover(function () {
        $(".active3 img").css({"transform": "rotate(180deg)", "transition": "all .1s"});
        $(".list10,.part").css("display", "none");
        $(".cat").css("display", "block");
    });
    $(".cat").mouseover(function () {
        $(".cat").css("display", "block");
    })
    $(".cat").mouseout(function () {
        $(".cat").css("display", "none");
    })
    $(".active3").mouseout(function () {
        $(".cat").css("display", "none");
        $(".active3 img").css({"transform": "rotate(0)", "transition": "all .1s"});

    });
    //回顶部
    var a = document.getElementById("wrap_r_block7")
    a.onclick = function () {
        document.documentElement.scrollTop = 0;
        document.body.scrollTop = 0;
    }

    //猫咪日用上面的三小块列表移入移出
    $(".move1").mouseover(function () {
        $(".bottom1").css("display", "block");
    })
    $(".move1").mouseout(function () {
        $(".bottom1").css("display", "none");
    })
    $(".bottom1").mouseover(function () {
        $(".bottom1").css("display", "block");
    })
    $(".bottom1").mouseout(function () {
        $(".bottom1").css("display", "none");
    })
    $(".move2").mouseover(function () {
        $(".bottom2").css("display", "block");
    })
    $(".move2").mouseout(function () {
        $(".bottom2").css("display", "none");
    })
    $(".bottom2").mouseover(function () {
        $(".bottom2").css("display", "block");
    })
    $(".bottom2").mouseout(function () {
        $(".bottom2").css("display", "none");
    })
    $(".move3").mouseover(function () {
        $(".bottom3").css("display", "block");
    })
    $(".move3").mouseout(function () {
        $(".bottom3").css("display", "none");
    })
    $(".bottom3").mouseover(function () {
        $(".bottom3").css("display", "block");
    })
    $(".bottom3").mouseout(function () {
        $(".bottom3").css("display", "none");
    })

    var oDiv = document.getElementById("box");
    var oSmallPic = document.getElementById("smallPic");
    var oP = document.getElementById("mark");  //遮罩
    var oSpan=document.getElementById("float"); //浮块
    var oBigPic=document.getElementById("bigPic"); //大图盒子
    var Img=$("#bigPic img")[0]; //大图
    var Img_1=$("#smallPic img")[0]; //小图
    //给遮罩添加移入事件
    oP.onmouseover = function(){
        oSpan.style.display = "block";
        oBigPic.style.display = "block";
    }
    //给遮罩添加移出事件
    oP.onmouseout = function(){
        oSpan.style.display = "none";
        oBigPic.style.display = "none";
    }
    oP.onmousemove  = function(evt){
        var e = evt || window.event;
        var l = e.clientX - oDiv.offsetLeft - oSmallPic.offsetLeft - oSpan.offsetWidth / 2;
        var t = e.clientY - oDiv.offsetTop - oSmallPic.offsetTop - oSpan.offsetHeight / 2;

        //设置边界
        if(l < 0){
            l = 0;
        }else if(l > oP.offsetWidth - oSpan.offsetWidth){
            l = oP.offsetWidth - oSpan.offsetWidth;
        }
        if(t < 0){
            t = 0;
        }else if(t > oP.offsetHeight - oSpan.offsetHeight){
            t = oP.offsetHeight - oSpan.offsetHeight;
        }
        oSpan.style.left = l + 'px';
        oSpan.style.top = t + 'px';


        //比例值
        var x = l / (oP.offsetWidth - oSpan.offsetWidth);
        var y = t / (oP.offsetHeight - oSpan.offsetHeight);

        //设置大图移动
        Img.style.left = - x * (Img.offsetWidth - oBigPic.offsetWidth) + "px";
        Img.style.top = - y * (Img.offsetHeight - oBigPic.offsetHeight) + "px";
    }

    //商品增加减少
    var m = 1;
    $(".add").click(function(){
        m ++;
        $(".present").val(m);
    })
    $(".sub").click(function(){
        if(m>0){
            m --;
            $(".present").val(m);
        }
    })
    //送至
    $(".dress").mouseover(function(){
        $(".jiantou").css({"transtion":"all 1s","transform":"rotate(180deg)"});
        $(".dress_show").css("display","block");
    })
    $(".dress").mouseout(function(){
        $(".jiantou").css({"transtion":"all 1s","transform":"rotate(0deg)"});
        $(".dress_show").css("display","none");
    })
    $(".dress_show").mouseover(function(){
        $(".dress_show").css("display","block");
    })
    //商品详情列表
    //$(".buyagain_r_list a li").click(function(){
    //    $(this).css({"border-top": "2px solid #e74085","height":"34px","background": "#fff"})
    //})
    //添加购物车
    $(".addCart").click(function(){
        var jsonData = {},
            jsonArr = [];
        jsonData.name = $('.productName').html();
        jsonData.prize = $('.productPrize').html();
        jsonData.count = $('.present').val();
        jsonData.imgUrl = $('#smallPic img').attr("src");
        jsonArr.push(jsonData);
        $.cookie('productData',JSON.stringify(jsonArr));
        console.log(JSON.stringify(jsonArr));
    });
})